<div class="{{this.baseClass}}__tag-input">
  {{#if (eq recipientType 'distributionList')}}
    {{#each @distributionLists as |distributionList index|}}
      <NachoPillInput
        class="{{this.baseClass}}__pill"
        @value={{distributionList}}
        @onDelete={{fn @removeRecipient this.recipientType index}}
      />
    {{/each}}
  {{else}}
    {{#each @individualRecipients as |individualRecipient index|}}
      <NachoPillInput
        class="{{this.baseClass}}__pill"
        @value={{individualRecipient}}
        @onDelete={{fn @removeRecipient this.recipientType index}}
      />
    {{/each}}
  {{/if}}
  <NachoPillInput
    class="{{this.baseClass}}__pill"
    @isTypeahead={{true}}
    @placeholder={{if (eq recipientType 'distributionList') "e.g.,datahub-dev" "e.g.,jweiner"}}
    @onComplete={{fn this.onAddRecipient}}
    @onSearch={{perform this.onSearchTask}}
    as |result|
    >
    <div class="{{this.baseClass}}__suggestions-list-item">
      <div class="{{this.baseClass}}__icon-container">
        {{#if (eq recipientType 'distributionList')}}
          <FaIcon
            class="{{this.baseClass}}__icon"
            @prefix="fas"
            @icon="users"
          />
        {{else}}
          <NachoAvatarImage
            class="{{this.baseClass}}__icon"
            @img={{result.profilePictureUrl}}
          />
        {{/if}}
      </div>
      <div class="{{this.baseClass}}__suggestions-list-item-detail">
        <div class="{{this.baseClass}}__suggestions-list-item-detail-name">
          <strong>
            {{if (eq recipientType 'distributionList') result.entity.name result.name}}
          </strong>
        </div>
        <div class="{{this.baseClass}}__suggestions-list-item-detail-email">
          {{if (eq recipientType 'distributionList') result.entity.info.email result.username}}
        </div>
      </div>
    </div>
  </NachoPillInput>
</div>